<!-- 活动副页面 -->
<template>
	<view>
		<image :src="vdata.activityDetail.activityImg2" style="width: 100%;" mode="widthFix"></image>
		<view class="bth-warp">
			<button plain @click="onJumpMchList">点击导航至适用门店</button>
		</view>
	</view>
</template>

<script setup>
	import { onLoad } from '@dcloudio/uni-app'
	import { reactive, getCurrentInstance } from 'vue'
	import { $getAwardList } from '@/http/apiManager.js'
	
	const { $infoBox } = getCurrentInstance().appContext.config.globalProperties
	
	// 数据源
	const vdata = reactive({
		activityDetail: {},	// 活动详情
		couponId: null,	// 卡券id
	})
	
	onLoad(({ activityId, activityDetail }) => {
		vdata.activityDetail = JSON.parse(decodeURIComponent(activityDetail))
		// 标题更改为活动名称
		uni.setNavigationBarTitle({
			title: vdata.activityDetail.activityName || '活动副页面'
		})
		// 获取当前活动配置的奖品列表
		$getAwardList({ activityId }).then(({ bizData }) => {
			vdata.couponId = bizData[0].awardId
		})
	})
	/** 跳转到适用门店列表 */
	function onJumpMchList(){
		if(!vdata.couponId){
			$infoBox.toast('奖品获取失败，请联系管理员')
			return
		}
		uni.navigateTo({
			url: `/pageUser/myCoupon/mchList?couponId=${vdata.couponId}`
		})
	}
</script>

<style lang="less">
	.bth-warp{
		padding: 24rpx 36rpx;
		background-color: #fff;
		button{
			border: none;
			background: linear-gradient(to right,#ff4c50,#ffac77);
			border-radius: 45rpx;
			color: #fff;
			font-family: YouSheBiaoTiHei;
		}
	}
</style>